<template>
    <h2>门店修改</h2>>
    <table class="table table-bordered">
        <tr>
            <td>门店名称</td>
            <td>
                <input type="text" placeholder="请输入门店名称" v-model="info.MName">
            </td>
        </tr>
        <tr>
            <td>分店名称</td>
            <td>
                <input type="text" placeholder="请输入门店名称" v-model="info.FName">
            </td>
        </tr>
        <tr>
            <td>商户地址</td>
            <td>
                <input type="text" placeholder="请输入门店名称" v-model="info.SAddr">
            </td>
        </tr>
        <tr>
            <td>门店图片</td>
            <td>
               <img :src="info.Pic" style="width: 100px; height: 100px;">
               <input type="file" @change="upLoad">
            </td>
        </tr>
        <tr>
            <td colspan="2">
                <input type="button" value="修改" @click="update">
            </td>
        </tr>
    </table>
</template>

<script setup lang="ts">
import {onMounted, ref} from 'vue'
import axios from 'axios'
import { useRoute } from 'vue-router';
import router from '@/router'

let route=useRoute()

const info=ref({
    ID:route.params.id,
    MName:'',
    FName:'',
    SAddr:'',
    Pic:'',
})

onMounted(()=>{
    getliss()
})

const getliss=()=>{
    axios.get('https://localhost:7231/api/MenDian/FT',{
        params:{
            id:route.params.id
        }
    })
    .then(res=>{
        info.value=res.data
    })
    .catch(err=>{
        console.log(err)
    })
}



const file=ref(null)
const upLoad=(e:any)=>{
    file.value=e.target.files[0];
    if(!file.value){
        alert("请选择文件")
        return;
    }
    const fromdata=new FormData();
    fromdata.append("file",file.value);
    axios.post('https://localhost:7231/api/Files/FileLoads',fromdata)
    .then(res=>{
        info.value.Pic=res.data[0];
    })
    .catch(err=>{
        console.log(err);
    })
}

const update=()=>{
    axios.post('https://localhost:7231/api/MenDian/UpdateMD',{
        id:route.params.id,
        mName:info.value.MName,
        fName:info.value.FName,
        sAddr:info.value.SAddr,
        pic:info.value.Pic,
    })
    .then(res=>{
        if(res.data>0){
            alert("修改成功")
            router.push('/ShoowMD')
        }
        else{
            alert("修改失败")
            return;
        }
    })
    .catch(err=>{
        console.log(err);
    })
}
</script>

<style scoped>

</style>